<template>
  <div class="my_attention ">
      <div class="attentionall">
          <a-list item-layout="horizontal" :data-source="likestea">
                <a-list-item slot="renderItem" slot-scope="item" >
                <a-list-item-meta
                    :description="item.desc"
                    @click="teacherdetail(item.id)"
                >
                    <a slot="title">{{ item.name }}</a>
                    <a-avatar
                    slot="avatar"
                    :size='50'
                    :src="item.image_url"
                    />
                </a-list-item-meta>
                <a-button type="primary" size="small" style="margin-left:10px" @click="unlike(item.id)">
                  取消关注
                </a-button>
                </a-list-item>
            </a-list>
      </div>
      <div class="qeee" style="text-align:center;margin-top:20px">
            <a-pagination v-model="current" size="small" :pageSize="pageSize" @change="currentpage" showQuickJumper  :total="total" show-less-items />
          </div>
  </div>
</template>

<script>
import {getmylikesData} from '../../api/usercenter'
import axios from '../../utils/axios'
export default {
    data() {
        return {
            likestea:[],
            current:1,
            pageSize:8,
            total:0,
        }
    },
    methods:{
      teacherdetail(val){
            this.$router.push({path:'/teacherclass',query:{id:val}})
        },
      unlike(id){
        let url = `/trains/click_teacher/${id}/`
        axios.post(url).then(res=>{
          this.ljkdfsd()
        })
      },
      currentpage(val){
          this.current = val
          this.ljkdfsd()
      },
      ljkdfsd(){
        let page = this.current
        let page_size = this.pageSize
        getmylikesData(page,page_size).then(res=>{
          this.likestea = res.results
          this.total = res.count
        })
      }
    },
    created(){
      this.ljkdfsd()
    }
}
</script>

<style lang='less'>
.my_attention{
    padding: 15px;
}
</style>